<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BIZSOLUTIONS!</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <!-- 主要内容 -->
    <div id="main">
        <!-- 上面导航 -->
        <nav>
            <a href="">HOME</a>
            <a href="">ABOUT</a>
            <a href="">ARTICLES</a>
            <a href="">CONTACTS</a>
            <a href="" id="fifth-a">SITEMAP</a>
            <a href="" class="img-a"><img src="./images/pic-home-act.gif"></a>
            <a href="" class="img-a"><img src="./images/pic-mail.gif"></a>
            <a href="" class="img-a"><img src="./images/pic-sitemap.gif"></a>
        </nav>
        <!-- 中间 -->
        <div id="mid">
        <!-- 中间左边 -->
            <div id="mid-left">
                    <img src="./images/logo.gif" id="logo">
                    <div id="slogen"><img src="./images/slogan.gif" alt=""></div>
                    <article>
                        <h1><span class="big-red">WELCOME</span> TO BIZSOLUTIONS!</h1>
                        <p>BizSolutions is a free web template created by TemplateMonster.com team. This website template is optimized for 1024X768 screen resolution and can be delivered in two packages - with PSD source files included and without them. It has several pages: <span class="small-red">Home</span>,<span class="small-red">About</span>,<span class="small-red">Articles</span>  (with Article page),<span class="small-red">Contacts</span>  (note that contact us form – doesn’t work),<span class="small-red">Site Map</span> .</p>
                    </article>
                    <div id="left-bottom">
                        <div class="left">
                            <div class="top"><span class="big-red">LATEST</span> NEWS</div>
                            <div id="bottom1">
                                <p class="title">24.08.2010</p>
                                <p><span class="small-red">Sed ut perspiciatis unomnis</span> iste natus eirsot volup tatem accusantiuveniam, quis nostrud exercitation ullamco laboris .</p>
                                <p class="title">19.08.2010</p>
                                <p><span class="small-red">Loremque laudantium</span>, totam aperiam eaque ipsa quae veniam, quis nostrud exercitation ullamco laboris ab illo inventore.</p>
                                <p class="title">24.08.2010</p>
                                <p><span class="small-red">Sed ut perspiciatis unomnis</span> iste natus eirsot volup tatem veniam, quis nostrud exercitation ullamco laboris accusantiu.</p>
                            </div>
                        </div>
                        <div class="right">
                            <div class="top"><span class="big-red">RECENT</span> ARTICLES</div>
                            <div class="pic">
                                <img src="./images/icon1.gif" >
                                <img src="./images/icon2.png" >
                                <img src="./images/icon3.gif" >
                            </div>
                            <div id="bottom2">
                                <p class="title">About Template</p>
                                <p>Free 1028X768 Template from TemplateMonster.com! We hope that you like it.</p>
                                <p class="title">Services for You</p>
                                <p>Sed ut perspiciatis unomnis iste natus error sit volup tatem accusantiu.</p>
                                <p class="title">Health Insurance</p>
                                <p>Loremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore.</p>
                            </div>
                        </div>
                    </div>
            </div>
            <!-- 中间右边 -->
            <div id="mid-right">
                <div class="search">
                    <div id="rec"></div>
                    <img src="./images/button-search.gif">
                </div>
                <aside class="small">
                    <h2>Health Insurance</h2>
                    <p>Sed ut perspiciatis undomnis iste natus error</p>
                    <h2>Auto Insurance</h2>
                    <p>Nequeporo quisquam estqui dolorem ipsuquia dolor</p>
                    <h2>Home Insurance</h2>
                    <p>Temporibus autem qubusdam et aut officiis</p>
                </aside>
                <aside class="big">
                    <h1>OUR </h1>
                    <h1>SERVICES</h1>
                    <aside id="leader">
                        <div class="maker">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                            <img src="./images/marker.gif">
                        </div>
                        <div class="text">
                            <ul>
                                <li>Sedut perspiciatis</li>
                                <li>Unde omnisiste</li>
                                <li>Natus errorsit voluptatem</li>
                                <li>Accusantium</li>
                                <li>Doloremque laudtium</li>
                                <li>Totamrem aperiam</li>
                                <li>Eaque ipsaquae</li>
                                <li>Lnventore veritatis</li>
                                <li>Quasi architecto betae</li>
                                <li>Vitaedicta sunt</li>
                                <li>Nemoenim ipsam</li>
                                <li>Voluptatem quia</li>
                                <li>Dluptas sit aspernatur</li>
                                <li>Sedut perspiciatis</li>
                                <li>Unde omnisiste</li>
                                <li>Natus errorsit voluptatem</li>
                                <li>Accusantium</li>
                                <li>Doloremque laudtium</li>
                                <li>Totamrem aperiam</li>
                                <li>Eaque ipsaquae</li>
                                <li>Lnventore veritatis</li>
                                <li>More Services</li>
                                <li>Natus errorsit voluptatem</li>
                            </ul>
                        </div>
                    </aside>
                </aside>
                <div id="button">More Services</div>
            </div>
        </div>
    </div>
    <!-- 底部 -->
    <footer>
        <p><span class="small-red">Website template</span> designed by TemplateMonster.com</p>
        <p><span class="small-red">Models provided</span>  by Templates.com</p>
    </footer>
</body>
</html>